<template>
  <div class="login">
    <div class="logo"></div>
    <button class="login-btn" open-type="getUserInfo" lang="zh_CN" @getuserinfo="doLogin">微信登录</button>
  </div>
</template>
<script>
import { getOpenId } from '@/api'
import { getUserInfo, setStorageSync, getStorageSync } from '@/api/wechat'
export default {
  methods: {
    getUserInfo() {
      const vue = this
      const onOpenIdComplete = (vue, openId, userInfo) => {
        vue.openId = openId
      }
      console.log('getUserInfo...')
      getUserInfo(
        (userInfo) => {
          vue.userInfo = userInfo
          setStorageSync('userInfo', userInfo)
          const openId = getStorageSync('openId')
          console.log('openId', openId)
          if (!openId || openId.length === 0) {
            getOpenId((openId) => {
              onOpenIdComplete(vue, openId, userInfo)
            })
          } else {
            onOpenIdComplete(vue, openId, userInfo)
          }
        },
        (err) => {
          console.log('getUserInfo failed', err)
        }
      )
    },
    doLogin() {
      this.getUserInfo()
    },
  },
}
</script>
<style lang='scss' scoped>
@import './style';
</style>